<template>
  <el-dialog
    v-dialogDrag
    ref="isPopWindows"
    title="提示"
    :visible.sync="isViewPopWindows"
    width="70%"
    :append-to-body="true"
    :close-on-click-modal="false"
    center
    @close="close"
    @opened="open"
  >
    <dialogHeader
      slot="title"
      title="备件订单明细"
      :style-type="$store.state.app.dialogType"
    />
    <div class="formBoxContain">
      <!--
            buttons: 按钮
            froms: 表单
            fromsField: 表单对应的字段
            tableOption: 网格项
            dynamicApiConfigs: 取值
         -->

      <one-table-template
        ref="isPopWindowsTable"
        :dynamic-buttons="tableButtons"
        :dynamic-components="tableComponents"
        :dynamic-form-fields="formField"
        :dynamic-table-cols="tableCols"
        :dynamic-table-defult-height="350"
        :dynamic-api-config="apiConfig"
        :dynamic-is-show-select="false"
        :dynamic-is-show-more-btn="true"
        :dynamic-is-init-table="false"
        :is-show-pagination="false"
        :callback-obj="callbackObj"
      />
    </div>
  </el-dialog>
</template>

<script>
import dialogHeader from '@/components/dialogHeader'
import OneTableTemplate from '@/components/templates/oneTable'
import api from '@/api/vehicleManagement'
import { vehiclePdiPriceInquirys } from '@/api/se/vehiclePdiPriceInquiry'
import { exportExcel } from '@/utils/getTimeString.js'

export default {
  components: {
    dialogHeader,
    OneTableTemplate
  },
  props: {
    // 是否关闭弹窗
    isViewPopWindows: {
      type: Boolean,
      default: false
    },
    dynamicEditRowData: {
      type: Object,
      default: function() {
        return {}
      }
    }
  },
  data() {
    // 页面标识（与上面beforeRouteEnter中的对应）
    const viewPageCode = this.$route.path

    // 绑定事件配置化事件
    this.$ConfigCache.CacheConfig.bindEvent(this, [viewPageCode])
    return {
      selectiondata: [],
      dynamicApiConfigs: '',
      tableComponents:
        this.$ConfigCache.CacheConfig.cacheData[this.$route.path] &&
        this.$ConfigCache.CacheConfig.cacheData[this.$route.path]
          .tableComponents &&
        this.$ConfigCache.CacheConfig.cacheData[this.$route.path]
          .tableComponents.length > 0
          ? this.$ConfigCache.CacheConfig.cacheData[this.$route.path]
            .tableComponents
          : [
            // {
            //   compKey: 'compKey1',
            //   labelName: '网点:',
            //   codeField: 'a',
            //   component: () => import('@/components/org/commonInput'),
            //   type: 'inputText',
            //   isMust: true,
            //   span: 6
            // },
            // {
            //   compKey: 'compKey2',
            //   labelName: '订货日期:',
            //   codeField: 'b',
            //   component: () =>
            //     import('@/components/org/datePicker/andtDatePicker'),
            //   type: 'inputText',
            //   isMust: true,
            //   span: 6
            // },
            // {
            //   compKey: 'compKey3',
            //   labelName: '订单类型：',
            //   codeField: 'c',
            //   component: () => import('@/components/org/LookupValue'),
            //   oFields: 'statusId,statusText',
            //   options: [
            //     { statusId: '', statusText: '全部' },
            //     { statusId: '0', statusText: '常规订单' },
            //     { statusId: '1', statusText: '紧急订单' },
            //     { statusId: '2', statusText: '三包订单' },
            //     { statusId: '3', statusText: '外采订单' }
            //   ],
            //   type: 'dropdownList',
            //   isMul: false,
            //   isMust: true,
            //   span: 6
            // },
            // {
            //   compKey: 'compKey4',
            //   labelName: '运输方式：',
            //   codeField: 'd',
            //   component: () => import('@/components/org/LookupValue'),
            //   oFields: 'statusId,statusText',
            //   options: [
            //     { statusId: '', statusText: '全部' },
            //     { statusId: '0', statusText: '公路' },
            //     { statusId: '1', statusText: '铁路' },
            //     { statusId: '2', statusText: '航空' },
            //     { statusId: '3', statusText: '快递' },
            //     { statusId: '4', statusText: '...其他' }
            //   ],
            //   type: 'dropdownList',
            //   isMul: false,
            //   isMust: true
            // },
            // {
            //   compKey: 'compKey5',
            //   labelName: '供应商:',
            //   codeField: 'e',
            //   component: () => import('@/components/org/commonInput'),
            //   type: 'inputText',
            //   isMust: true,
            //   span: 6
            // },
            // {
            //   compKey: 'compKey6',
            //   labelName: '订单号:',
            //   codeField: 'f',
            //   component: () => import('@/components/org/commonInput'),
            //   type: 'inputText',
            //   isMust: true,
            //   span: 6
            // }
          ],
      formField: this.$utils.getFormField(this, {
        purOrderCode: '',
        purDate: '',
        purOrderType: '',
        transportModeName: '',
        dlrId: '',
        dlrCode: '',
        purchaseOrderId: '',
        updateControlId: ''
      }),
      // 回调方法对象
      callbackObj: {
        // 网格点击回调事件
        onRowClick: (currentRow) => {
          // this.onRightRowClick(currentRow);
        },
        // 手动勾选网格时，拿到勾选网格的数据
        // onCheckSelect: (selection, row) => {
        //   this.selectiondata = selection
        // },
        onCheckSelectChange: (selection) => {
          // this.onCheckSelectChange1(selection)
          this.selectiondata = selection
        }
      },

      // 动态组件-按钮
      tableButtons: [
        // {
        //   compKey: 'button1',
        //   type: 'primary',
        //   size: 'small',
        //   name: 'search',
        //   clickEvent: () => this.open(),
        //   text: '查询',
        //   position: 'right'
        // },
        // {
        //   compKey: 'button1',
        //   type: 'primary',
        //   size: 'small',
        //   name: '',
        //   clickEvent: () => this.pass(),
        //   text: '审核',
        //   position: 'right'
        // },
        // {
        //   compKey: 'button5',
        //   type: '',
        //   size: 'small',
        //   icon: '',
        //   name: 'export',
        //   clickEvent: () => this.exportExcel111(),
        //   text: '导出',
        //   position: 'right'
        // },
        // {
        //   compKey: 'button6',
        //   type: '',
        //   size: 'small',
        //   icon: '',
        //   name: 'reset',
        //   clickEvent: () => this.$refs.isPopWindowsTable.reset(),
        //   text: '重置',
        //   position: 'right'
        // }
      ],
      // 动态生成网格列
      tableCols:
        this.$ConfigCache.CacheConfig.cacheData[this.$route.path] &&
        this.$ConfigCache.CacheConfig.cacheData[this.$route.path].tableCols &&
        this.$ConfigCache.CacheConfig.cacheData[this.$route.path].tableCols
          .length > 0
          ? this.$ConfigCache.CacheConfig.cacheData[this.$route.path].tableCols
          : [
            {
              prop: 'isCanLack',
              label: '可欠拨',
              align: 'center',
              isFlag: true,
              width: 50
            },
            {
              prop: 'dlrCode',
              label: '网点编码',
              align: 'center'
            },
            {
              prop: 'dlrShortName',
              label: '网点名称',
              align: 'center',
              width: 110
            },
            {
              prop: 'purOrderCode',
              label: '订单号',
              align: 'center',
              width: 150
            },
            {
              prop: 'partNo',
              label: '备件号',
              align: 'center'
            },
            {
              prop: 'partName',
              label: '备件名称',
              align: 'center'
            },
            {
              prop: 'unit',
              label: '计量单位',
              align: 'center'
            },
            {
              prop: 'minPurchasePage',
              label: '最小订单数',
              align: 'center'
            },
            {
              prop: 'purPrice',
              label: '单价',
              align: 'center'
            },
            {
              prop: 'purQty',
              label: '订货数量+',
              align: 'center'
            },
            {
              prop: 'purAmount',
              label: '订货金额',
              align: 'center'
            },
            {
              prop: 'sumAccountQty',
              label: '库存数量',
              align: 'center'
            },
            {
              prop: 'availableInventory',
              label: '可用库存',
              align: 'center'
            },
            {
              prop: 'validLackQty',
              label: '有效欠拨数量',
              align: 'center'
            },
            // {
            //   prop: 'assignWorkCode',
            //   label: '派工单号+',
            //   align: 'center'
            // },
            // {
            //   prop: 'vin',
            //   label: 'VIN码+',
            //   align: 'center'
            // },
            // {
            //   prop: 'carLicense',
            //   label: '车牌号+',
            //   align: 'center'
            // },
            // {
            //   prop: 'custName',
            //   label: '客户名称+',
            //   align: 'center'
            // },
            // {
            //   prop: 'custTel',
            //   label: '客户电话+',
            //   align: 'center'
            // }
          ]
    }
  },
  methods: {
    /**
     * @description 关闭弹窗
     * @time 2021、01、22
     */
    close() {
      this.$emit('close')
    },
    open() {
      console.log(this.dynamicEditRowData, 444)
      this.formField.purOrderCode = this.dynamicEditRowData.purOrderCode
      this.formField.purDate = this.dynamicEditRowData.purDate
      this.formField.purOrderType = this.dynamicEditRowData.purOrderType
      this.formField.transportModeName = this.dynamicEditRowData.transportModeName
      this.formField.dlrId = this.dynamicEditRowData.dlrId
      this.formField.purchaseOrderId = this.dynamicEditRowData.purchaseOrderId
      this.formField.updateControlId = this.dynamicEditRowData.updateControlId
      this.formField.updateControlId = this.dynamicEditRowData.updateControlId

      const that = this
      const queryObj = {
        // 保存mutation
        type: 'mutation',
        // api配置
        apiConfig: vehiclePdiPriceInquirys.queryDetail,
        // 条件/实体参数（变量），根据typeParam中的定义配置
        variables: {
          purOrderCode: this.formField.purOrderCode,
          purDate: this.formField.purDate,
          purOrderType: this.formField.purOrderType,
          transportModeName: this.formField.transportModeName,
          dlrId: this.formField.dlrId,
          dlrCode: this.formField.dlrCode,
          purchaseOrderId: this.formField.purchaseOrderId,
          updateControlId: this.formField.updateControlId

        }
      }
      // 转换了中台请求格式数据
      var paramD = that.$getParams(queryObj)
      // 调用中台API方法（可复用）
      that.$requestAPI(paramD).then((response) => {
        this.$refs.isPopWindowsTable.list = response.rows
      })
    },
    // 通过
    pass() {
      if (!this.selectiondata.length) {
        this.$message({message: '请至少选择一条数据', type: 'warn', duration: 1000})
      } else {
        const that = this
        const queryObj = {
          // 保存mutation
          type: 'mutation',
          // api配置
          apiConfig: vehiclePdiPriceInquirys.updateReview,
          // 条件/实体参数（变量），根据typeParam中的定义配置
          variables: { list: this.selectiondata }
        }
        // 转换了中台请求格式数据
        var paramD = that.$getParams(queryObj)
        // 调用中台API方法（可复用）
        that.$requestAPI(paramD).then((response) => {
          if (response.result === '1') {
            this.$message({
              message: '已通过',
              type: 'success',
              duration: 2000
            })
            this.open()
            this.isViewPopWindows = false
          } else {
            // 保存失败
            this.$message({
              message: '保存失败',
              type: 'warn',
              duration: 2000
            })
          }
        })
      }
    },
    // 导出
    exportExcel111() {
      exportExcel(
        this.formField,
        vehiclePdiPriceInquirys.exportDetail.APIUrl,
        vehiclePdiPriceInquirys.exportDetail.ServiceCode,
        '备件订单明细'
      )
    }
  }
}
</script>
<style scoped>

</style>
